<template>
  <router-view v-slot="{ Component }">
    <transition name="fade" mode="out-in">
      <component :is="Component" />
    </transition>
  </router-view>
</template>

<script setup lang="ts">
import { onMounted } from 'vue'
import { useThemeStore } from './stores/theme'
import { useUserStore } from './stores/user'

const themeStore = useThemeStore()
const userStore = useUserStore()

onMounted(() => {
  // 初始化用户信息和 token 同步
  userStore.initialize()
  
  // 初始化主题
  if (themeStore.primaryColor) {
    themeStore.setPrimaryColor(themeStore.primaryColor)
  }
})
</script>

<style>
/* 路由过渡动画已在 global.scss 中定义 */
</style>
